<template>
  <el-card class="app-container">
    <div v-if="!open">
      <div class="itemTitle">承包商管理</div>
      <div class="search">
        <el-form
          :inline="true"
          :model="queryParams"
          ref="queryForm"
          class="demo-form-inline"
          label-width="120"
          @submit.native.prevent
        >
          <el-row>
            <el-col :span="5">
              <el-form-item label="企业名称" prop="companyName">
                <el-input
                  @keyup.enter.native="handleQuery"
                  v-model="queryParams.companyName"
                  placeholder="企业名称"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="5">
              <el-form-item>
                <el-button type="primary" @click="handleQuery">搜索</el-button>
                <el-button @click="resetQuery">重置</el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <div class="content">
        <div class="ct-btns">
          <el-button type="primary" @click="handleAdd">新增</el-button>
          <el-button type="success" @click="handleImport">批量导入</el-button>
          <el-button type="warning" @click="handleExport">批量导出</el-button>
          <el-button type="info" @click="importTemplate"
            >下载导入模版</el-button
          >
        </div>
        <div class="ct-table">
          <elTables
            :table-data="tableData"
            :columns="tableColumns"
            :handle-current-change="handleCurrentChange"
            :totalLength="total"
            :currentPage="queryParams.pageNum"
            isPagin
            :curHeight="tableHeight"
          />
        </div>
      </div>
    </div>
    <div v-else class="page-edit">
      <header>
        <i
          style="font-size: 18px; cursor: pointer; margin-right: 8px;"
          class="el-icon-arrow-left"
          @click="open = !open"
        ></i>
        <span>{{ title }}</span>
      </header>
      <section class="edit-body">
        <div class="title-level2">企业基本概况</div>
        <el-form
          ref="form"
          :model="form"
          :rules="rules"
          :readonly="readonly"
          label-width="220px"
        >
          <el-row>
            <el-col
              :span="item.span"
              v-for="(item, index) in formList"
              :key="index"
            >
              <!-- input -->
              <el-form-item
                v-if="item.type == 'input'"
                :label="item.label"
                :prop="item.prop"
              >
                <el-input
                  style="width: 100%"
                  v-model.trim="form[item.prop]"
                  :maxlength="item.maxlength"
                  :readonly="readonly"
                  :disabled="readonly"
                  :placeholder="'请输入' + item.label"
                />
              </el-form-item>
              <!-- inputCompany -->
              <el-form-item
                v-if="item.type == 'inputCompany'"
                v-show="
                  title !== '新增' && title !== '审核' && form.number !== null
                "
                :label="item.label"
                :prop="item.prop"
              >
                <el-input
                  style="width: 100%"
                  v-model="form[item.prop]"
                  :readonly="readonly"
                  :disabled="readonly"
                  :placeholder="'企业编号在审核全部通过后才会产生！'"
                />
              </el-form-item>
              <!-- inputNumber -->
              <el-form-item
                v-if="item.type == 'inputNumber'"
                :label="item.label"
                :prop="item.prop"
              >
                <el-input
                  style="width: 100%"
                  v-model.trim="form[item.prop]"
                  :maxlength="item.maxlength"
                  :readonly="readonly"
                  :disabled="readonly"
                  :placeholder="'请输入' + item.label"
                />
              </el-form-item>

              <!-- inputPhone -->
              <el-form-item
                v-if="item.type == 'inputPhone'"
                :label="item.label"
                :prop="item.prop"
              >
                <el-input
                  style="width: 100%"
                  v-model.trim="form[item.prop]"
                  :maxlength="item.maxlength"
                  :readonly="readonly"
                  :disabled="readonly"
                  :placeholder="'请输入' + item.label"
                />
              </el-form-item>
              <el-form-item
                v-if="item.type == 'textarea'"
                :label="item.label"
                :prop="item.prop"
              >
                <el-input
                  show-word-limit
                  type="textarea"
                  :rows="3"
                  style="width: 100%"
                  v-model.trim="form[item.prop]"
                  :maxlength="item.maxlength"
                  :readonly="readonly"
                  :disabled="readonly"
                  :placeholder="'请输入' + item.label"
                />
              </el-form-item>
              <!-- date -->
              <el-form-item
                v-if="item.type == 'date'"
                :label="item.label"
                :prop="item.prop"
              >
                <el-date-picker
                  :readonly="readonly"
                  :disabled="readonly"
                  style="width: 100%"
                  format="yyyy 年 MM 月 dd 日"
                  value-format="yyyy-MM-dd"
                  v-model="form[item.prop]"
                  type="date"
                  :placeholder="'请选择' + item.label"
                >
                </el-date-picker>
              </el-form-item>
              <!-- radio -->
              <el-form-item
                v-if="item.type == 'radio'"
                :label="item.label"
                :prop="item.prop"
              >
                <el-radio-group style="width: 100%" v-model="form[item.prop]">
                  <el-radio :disabled="readonly" :label="0">是</el-radio>
                  <el-radio :disabled="readonly" :label="1">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <!-- selectDept -->
              <!-- <el-form-item
              v-if="item.type == 'selectDept'"
              :label="item.label"
              :prop="item.prop"
            >
              <inputTreeselect
                :isAddress="true"
                @emitDeptId="emitAddressId"
                v-model="form[item.prop]"
                :disabled="readonly"
              ></inputTreeselect>
            </el-form-item> -->
            </el-col>
            <el-col
              :span="item.span"
              v-for="(item, i) in formList1"
              :key="i + 'a'"
            >
              <div v-if="item.label == '资质'" class="title-level2">
                资质证书
              </div>
              <el-form-item v-else :label="item.label" :prop="item.prop">
                <div v-if="!readonly" class="formitem">
                  <el-button
                    class="btn"
                    plain
                    type="primary"
                    @click="uploadCommon(item)"
                    size="mini"
                    >上传</el-button
                  >
                  <div v-if="!readonly && form[item.prop]" class="rightitem">
                    <div>
                      <span
                        title="预览"
                        style="margin-right: 10px; color: #46a6ff"
                        @click="lookImg(JSON.parse(form[item.prop])[0])"
                      >
                        {{ JSON.parse(form[item.prop])[0].name }}</span
                      >
                      <i
                        title="删除"
                        style="color: #000"
                        @click="delBtn(item)"
                        class="el-icon-delete"
                      ></i>
                    </div>
                  </div>
                </div>
                <el-button v-else type="text"
                  >{{ form[item.prop] ? form[item.prop].fileName : "" }}
                  <span
                    v-for="(info, ind) in form[item.prop]"
                    :key="ind"
                    @click="lookImg(info)"
                    >预览</span
                  >
                </el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </section>
      <footer>
        <div class="dialog-footer" style="text-align: center">
          <el-button @click="cancel" style="margin-right: 10px"
            >取 消</el-button
          >
          <el-button type="primary" @click="submitForm">确 定</el-button>
        </div>
      </footer>
    </div>
    <!-- 上传组件 -->
    <el-dialog
      :title="actionFile.label"
      :visible.sync="openUpload"
      append-to-body
    >
      <elUploads
        :fileList="fileList"
        ref="uploads"
        :action="action"
        :auto-upload="true"
        :accept="'.doc,.docx,.pdf'"
        :limit="1"
        :remove-file="removeFile"
        :success-fun="success"
      />
      <div class="el-upload__tip" style="color: grey">
        提示：仅允许上传.doc,.docx,.pdf格式文件，且不能超过100M！
      </div>
    </el-dialog>
    <!-- 导入 -->
    <el-dialog
      :title="upload.title"
      :visible.sync="upload.open"
      width="800px"
      append-to-body
    >
      <el-upload
        ref="upload"
        :limit="1"
        accept=".xlsx, .xls"
        :headers="upload.headers"
        :action="upload.url"
        :disabled="upload.isUploading"
        :on-progress="handleFileUploadProgress"
        :on-success="handleFileSuccess"
        :auto-upload="false"
        drag
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">
          将文件拖到此处，或
          <em>点击上传</em>
        </div>
        <div class="el-upload__tip" style="color: red" slot="tip">
          提示：仅允许导入“xls”或“xlsx”格式文件！
        </div>
      </el-upload>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFileForm">确 定</el-button>
        <el-button @click="upload.open = false">取 消</el-button>
      </div>
    </el-dialog>

    <el-dialog
      title="预览文件"
      :visible.sync="viewCoursewareVisible"
      append-to-body
      @close="closePopup"
      :key="popupKey"
    >
      <iframe
        width="800px"
        height="700px"
        :src="viewFileSrc"
        v-if="isPdf"
      ></iframe>
      <el-image
        v-if="isImg"
        style="width: 600px; height: 600px"
        :src="viewFileSrc"
      ></el-image>
      <div ref="file" v-if="isWord" style="width: 800px; height: 800px"></div>
    </el-dialog>
  </el-card>
</template>
  <script>
const defaultQueryParams = {
  pageNum: 1,
  pageSize: 10,
};
import { resources, resources1 } from "@/api/specialWork/contractor.js";
import {
  pageContractor,
  getContractor,
  delContractor,
  addContractor,
  updateContractor,
  exportContractor,
  downImportTemplate,
} from "@/api/specialWork/contractor";
import { getToken } from "@/utils/auth";
const docx = require("docx-preview");
window.JSZip = require("jszip");
export default {
  data() {
    const checkMobile = (rule, value, cb) => {
      if (value) {
        const regMobile = /^1[3,4,5,6,7,8,9][0-9]{9}$/;
        if (regMobile.test(value)) {
          return cb();
        } else if (!rule.required && !value) {
          return cb();
        } else {
          cb(new Error("请输入正确的手机号"));
        }
      } else {
        return cb();
      }
    };
    // 项目负责人专用校验
    const checkMobile2 = (rule, value, cb) => {
      const regMobile = /^1[3,4,5,6,7,8,9][0-9]{9}$/;
      if (regMobile.test(value)) {
        checkThirdEnterprisePhone(value).then((res) => {
          if (res.data) {
            cb(new Error(res.msg));
          } else {
            return cb();
          }
        });
      } else if (!rule.required && !value) {
        return cb();
      } else {
        cb(new Error("请输入正确的手机号"));
      }
    };
    return {
      actionFile: {}, //当前选中上传的文件
      openUpload: false, //上传弹窗
      fileList: [],
      action: process.env.VUE_APP_BASE_API + "/common/upload",
      formList: [
        {
          label: "企业名称",
          prop: "companyName",
          span: 8,
          type: "input",
          maxlength: 30,
        },

        {
          label: "隶属单位",
          prop: "affiliatedUnit",
          span: 8,
          type: "input",
          maxlength: 50,
        },
        {
          label: "企业性质",
          prop: "companyNature",
          span: 8,
          type: "input",
          maxlength: 30,
        },
        {
          label: "通讯地址",
          prop: "address",
          span: 16,
          type: "input",
          maxlength: 50,
        },
        {
          label: "邮政编码",
          prop: "postalCode",
          span: 8,
          type: "input",
          maxlength: 6,
        },

        {
          label: "企业人数",
          prop: "peopleNum",
          span: 8,
          type: "inputNumber",
          maxlength: 30,
        },
        {
          label: "法定代表人",
          prop: "legalPeople",
          span: 8,
          type: "input",
          maxlength: 30,
        },
        {
          label: "法定代表人电话",
          prop: "legalPeoplePhone",
          span: 8,
          type: "inputPhone",
          maxlength: 11,
        },
        {
          label: "董事长",
          prop: "chairman",
          span: 8,
          type: "input",
          maxlength: 30,
        },
        // {
        //   label: "董事长电话",
        //   prop: "chaimanPhonenumber",
        //   span: 8,
        //   type: "inputPhone",
        //   maxlength: 11,
        // },
        {
          label: "项目负责人",
          prop: "projectPeople",
          span: 8,
          type: "input",
          maxlength: 30,
        },
        {
          label: "项目负责人电话",
          prop: "projectPeoplePhone",
          span: 8,
          type: "inputPhone",
          maxlength: 11,
        },
        {
          label: "项目经理",
          prop: "projectManage",
          span: 8,
          type: "input",
          maxlength: 30,
        },
        {
          label: "项目经理电话",
          prop: "projectManagePhone",
          span: 8,
          type: "inputPhone",
          maxlength: 11,
        },
        {
          label: "安全管理人员",
          prop: "safeMange",
          span: 8,
          type: "input",
          maxlength: 30,
        },
        {
          label: "安全管理人员电话",
          prop: "safeMangePhone",
          span: 8,
          type: "inputPhone",
          maxlength: 11,
        },
        {},
        /*    {
          label: "安全员",
          prop: "safetyOfficerName",
          span: 8,
          type: "input",
          maxlength: 50,
        },
        {
          label: "安全员电话",
          prop: "safetyOfficerPhonenumber",
          span: 8,
          type: "inputPhone",
          maxlength: 11,
        },*/
        // {
        //   label: "责任部门",
        //   prop: "responsibleId",
        //   span: 8,
        //   type: "selectDept",
        //   maxlength: 50,
        // },
        {
          label: "业务范围",
          prop: "businessScope",
          span: 16,
          type: "textarea",
          maxlength: 300,
        },
      ],
      //资质证书
      formList1: [
        {
          label: "资质",
          prop: "anquan",
          span: 24,
          type: "upload",
        },
        {
          label: "安全管理协议书",
          prop: "fileSecurityManageProtocol",
          span: 8,
          type: "upload",
        },
        {
          label: "安全文明施工承诺书",
          prop: "fileSafeCultureBuild",
          span: 8,
          type: "upload",
        },
        {
          label: "营业执照",
          prop: "fileBusinessLicense",
          span: 8,
          type: "upload",
        },
        {
          label: "安全生产许可证复印件",
          prop: "fileSafeProductLicense",
          span: 8,
          type: "upload",
        },
        {
          label: "安全环保组织机构图",
          prop: "fileSafeEnvironmentalProtection",
          span: 8,
          type: "upload",
        },
        {
          label: "安全管理人员登记表",
          prop: "fileSafeManagePeopleRegister",
          span: 8,
          type: "upload",
        },
        {
          label: "安全管理人员资格证",
          prop: "fileSafeManagePeopleCertificate",
          span: 8,
          type: "upload",
        },
        {
          label: "特种作业人员登记表",
          prop: "fileSpecialWorkPeopleRegister",
          span: 8,
          type: "upload",
        },
        {
          label: "特殊工种作业人员操作证",
          prop: "fileSpecialWorkPeopleOperate",
          span: 8,
          type: "upload",
        },
        {
          label: "大型机具相关证件",
          prop: "fileBigImplement",
          span: 8,
          type: "upload",
        },
        {
          label: "两年内安全事故原始记录",
          prop: "fileTwoYearSafe",
          span: 8,
          type: "upload",
        },
        {
          label: "事故隐患管理情况档案",
          prop: "fileAccidentHazardManage",
          span: 8,
          type: "upload",
        },
        {
          label: "安全管理制度或体系文件",
          prop: "fileSafeManageSetup",
          span: 8,
          type: "upload",
        },
        {
          label: "中标通知书",
          prop: "fileLetterAcceptance",
          span: 8,
          type: "upload",
        },
        {
          label: "施工方案及应急预案",
          prop: "fileBuildEmergency",
          span: 8,
          type: "upload",
        },
        {
          label: "最近三个月内工伤保险明细",
          prop: "fileThreeMonthInsure",
          span: 8,
          type: "upload",
        },
        {
          label: "政府部门颁发的资质及证明文件",
          prop: "fileGovernmentDepartment",
          span: 8,
          type: "upload",
        },
      ],
      rules: {
        companyName: [
          {
            required: true,
            message: "企业名称不能为空",
            trigger: ["blur", "change"],
          },
        ],
        // affiliatedUnit: [
        //   {
        //     required: true,
        //     message: "隶属单位不能为空",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        // address: [
        //   {
        //     required: true,
        //     message: "通讯地址不能为空",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        companyNature: [
          {
            required: true,
            message: "企业性质不能为空",
            trigger: ["blur", "change"],
          },
        ],
        // postalCode: [
        //   {
        //     required: true,
        //     message: "邮政编码不能为空",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        // peopleNum: [
        //   {
        //     required: true,
        //     message: "企业人数不能为空",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        legalPeople: [
          {
            required: true,
            message: "法定代表人不能为空",
            trigger: ["blur", "change"],
          },
        ],
        // chairman: [
        //   {
        //     required: true,
        //     message: "董事长不能为空",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        legalPeoplePhone: [
          {
            required: true,
            message: "法定代表人电话不能为空",
            trigger: ["blur", "change"],
          },
          {
            validator: checkMobile,
            trigger: "blur",
          },
          { min: 11, max: 11, message: "长度在 11个字符", trigger: "blur" },
        ],
        chaimanPhonenumber: [
          {
            required: false,
            validator: checkMobile,
            trigger: "blur",
          },
          { min: 11, max: 11, message: "长度在 11个字符", trigger: "blur" },
        ],
        projectPeople: [
          {
            required: true,
            message: "项目负责人不能为空",
            trigger: ["blur", "change"],
          },
        ],
        projectPeoplePhone: [
          {
            required: true,
            message: "项目负责人电话不能为空",
            trigger: ["blur", "change"],
          },
          {
            validator: checkMobile,
            trigger: "blur",
          },
          { min: 11, max: 11, message: "长度在 11个字符", trigger: "blur" },
        ],
        projectManage: [
          {
            required: true,
            message: "项目经理不能为空",
            trigger: ["blur", "change"],
          },
        ],
        projectManagePhone: [
          {
            required: true,
            message: "项目经理电话不能为空",
            trigger: ["blur", "change"],
          },
          {
            validator: checkMobile,
            trigger: "blur",
          },
          { min: 11, max: 11, message: "长度在 11个字符", trigger: "blur" },
        ],
        safeMange: [
          {
            required: true,
            message: "安全管理人员不能为空",
            trigger: ["blur", "change"],
          },
        ],
        safeMangePhone: [
          {
            required: true,
            message: "安全管理人员电话不能为空",
            trigger: ["blur", "change"],
          },
          {
            validator: checkMobile,
            trigger: "blur",
          },
          { min: 11, max: 11, message: "长度在 11个字符", trigger: "blur" },
        ],
        // businessScope: [
        //   {
        //     required: true,
        //     message: "业务范围不能为空",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        // fileSecurityManageProtocol: [
        //   {
        //     required: true,
        //     message: "请上传安全管理协议书",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        // fileBusinessLicense: [
        //   { required: true, message: "请上传营业执照", trigger: "blur,change" },
        // ],
        // safetyProduction: [
        //   {
        //     required: true,
        //     message: "请上传安全生产许可证",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        // safeQualificationCertificate: [
        //   {
        //     required: true,
        //     message: "请上传安全管理人员资格证",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        // operationCertificate: [
        //   {
        //     required: true,
        //     message: "请上传特殊工种作业人员操作证",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        // largeMachines: [
        //   {
        //     required: true,
        //     message: "请上传大型机具相关证件",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        // accountTwo: [
        //   {
        //     required: true,
        //     message: "请上传两年内安全事故原始记录",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        // bidWinner: [
        //   {
        //     required: true,
        //     message: "请上传中标通知书",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        // fileBuildEmergency: [
        //   {
        //     required: true,
        //     message: "请上传施工方案及应急预案",
        //     trigger: ["blur", "change"],
        //   },
        // ],
        // insuranceDetails: [
        //   {
        //     required: true,
        //     message: "请上传最近三个月内工伤保险明细",
        //     trigger: ["blur", "change"],
        //   },
        // ],
      },
      open: false,
      tableHeight: 0,
      tableColumns: [
        {
          key: "companyName",
          title: "企业名称",
        },
        {
          key: "affiliatedUnit",
          title: "隶属单位",
        },
        {
          key: "legalPeople",
          title: "企业负责人",
        },
        {
          key: "legalPeoplePhone",
          title: "负责人联系方式",
        },
        {
          title: "操作",
          align: "center",
          fixed: "right",
          width: 240,
          render: (h, params) => {
            return h("div", [
              h(
                "el-button",
                {
                  props: {
                    type: "text",
                    size: "small",
                  },
                  on: {
                    click: () => {
                      this.jumpThrid(params.row);
                    },
                  },
                },
                "查看队伍"
              ),
              h(
                "el-button",
                {
                  props: {
                    type: "text",
                    size: "small",
                  },
                  on: {
                    click: () => {
                      this.handleUpdate(params.row);
                    },
                  },
                },
                "编辑"
              ),
              h(
                "el-button",
                {
                  props: {
                    type: "text",
                    size: "small",
                  },
                  on: {
                    click: () => {
                      this.handleDelete(params.row);
                    },
                  },
                },
                "删除"
              ),
            ]);
          },
        },
      ],
      tableData: [],
      queryParams: {
        ...defaultQueryParams,
        companyName: "",
      },
      total: 0,
      form: {},
      // 用户导入参数
      upload: {
        // 是否显示弹出层（用户导入）
        open: false,
        // 弹出层标题（用户导入）
        title: "",
        // 是否禁用上传
        isUploading: false,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url:
          process.env.VUE_APP_BASE_API + "/specialWork/contractor/importData",
      },
      readonly: false,
      // 状态数据字典
      statusOptions: [],
      viewCoursewareVisible: false,
      viewFileSrc: "",
      isImg: false,
      isPdf: false,
      isWord: false,
      popupKey: Date.now(),
    };
  },
  created() {
    this.getDicts("sys_normal_disable").then((response) => {
      this.statusOptions = response.data;
    });
    this.getPage();
  },
  mounted() {
    this.$nextTick(() => {
      this.getTableHeight();
    });
  },
  methods: {
    closePopup() {
      this.popupKey = Date.now(); // 更新key值，强制重新加载组件
    },
    //预览文件
    resource(resource) {
      resources({ name: resource }).then((res) => {
        docx.renderAsync(res, this.$refs.file);
      });
    },
    //跳转第三方人员
    jumpThrid(row) {
      this.$router.push("/foreignManage/thirdParty?id=" + row.id);
    },
    /** 查询承包商管理列表 */
    getPage() {
      this.loading = true;
      pageContractor(this.queryParams).then((response) => {
        this.tableData = response.data.records;
        this.total = response.data.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        companyName: null,
        affiliatedUnit: null,
        companyNature: null,
        address: null,
        postalCode: null,
        peopleNum: null,
        legalPeople: null,
        legalPeoplePhone: null,
        chairman: null,
        projectPeople: null,
        projectPeoplePhone: null,
        projectManage: null,
        projectManagePhone: null,
        safeMange: null,
        safeMangePhone: null,
        businessScope: null,
        fileSecurityManageProtocol: null,
        fileSafeCultureBuild: null,
        fileBusinessLicense: null,
        fileSafeProductLicense: null,
        fileSafeEnvironmentalProtection: null,
        fileSafeManagePeopleRegister: null,
        fileSafeManagePeopleCertificate: null,
        fileSpecialWorkPeopleRegister: null,
        fileSpecialWorkPeopleOperate: null,
        fileBigImplement: null,
        fileTwoYearSafe: null,
        fileAccidentHazardManage: null,
        fileSafeManageSetup: null,
        fileLetterAcceptance: null,
        fileBuildEmergency: null,
        fileThreeMonthInsure: null,
        fileGovernmentDepartment: null,
        factoryId: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null,
        createDept: null,
        delFlag: null,
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getPage();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    /** 下载模板操作 */
    importTemplate() {
      downImportTemplate().then((response) => {
        this.download(response.msg);
      });
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id;
      getContractor(id).then((response) => {
        this.form = response.data;
        this.open = true;
        this.title = "编辑承包商管理";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.id != null) {
            updateContractor(this.form).then((response) => {
              this.msgSuccess("修改成功");
              this.open = false;
              this.getPage();
            });
          } else {
            addContractor(this.form).then((response) => {
              this.msgSuccess("新增成功");
              this.open = false;
              this.getPage();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id;
      this.$confirm("是否确认删除?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(function () {
          return delContractor([ids]);
        })
        .then(() => {
          this.getPage();
          this.msgSuccess("删除成功");
        });
    },
    /** 导出按钮操作 */
    handleExport() {
      const queryParams = this.queryParams;
      this.$confirm("是否确认导出所有承包商管理数据项?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(function () {
          return exportContractor(queryParams);
        })
        .then((response) => {
          this.download(response.msg);
        });
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.form = {};
      this.open = true;
      this.reset();
      this.title = "新增";
      this.readonly = false;
    },
    getTableHeight() {
      let height = document.getElementsByClassName("ct-table")[0].clientHeight;
      this.tableHeight = height - 40;
    },
    uploadCommon(val) {
      this.openUpload = true;
      this.actionFile = val;
      this.$nextTick(() => {
        this.$refs.uploads.$refs.uploadRef.clearFiles();
      });
    },
    /** 导入按钮操作 */
    handleImport() {
      this.upload.title = "承包商管理导入";
      this.upload.open = true;
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.upload.open = false;
      this.upload.isUploading = false;
      this.$refs.upload.clearFiles();
      this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
      this.getPage();
    },
    //预览文件
    lookImg(url) {
      if (url.fileName.includes("pdf")) {
        this.isPdf = true;
        this.viewCoursewareVisible = true;
        this.viewFileSrc = process.env.VUE_APP_BASE_API + url.fileName;
      } else if (url.fileName.includes("png") || url.fileName.includes("jpg")) {
        this.isImg = true;
        this.viewCoursewareVisible = true;
        this.viewFileSrc = process.env.VUE_APP_BASE_API + url.fileName;
      } else if (url.fileName.includes("docx")) {
        this.isWord = true;
        this.viewCoursewareVisible = true;
        this.viewFileSrc = process.env.VUE_APP_BASE_API + url.fileName;
        this.resource(this.viewFileSrc);
      } else if (url.fileName.includes("doc")) {
        this.viewCoursewareVisible = false;
        this.$message.warning("暂不支持预览doc文件");
        this.viewCoursewareVisible = false;
      }
    },
    //删除文件
    delBtn(item) {
      this.$confirm("是否删除?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then((res) => {
        this.$set(this.form, item.prop, "");
        this.$forceUpdate();
      });
    },
    // 上传文件
    success(response, file, fileList) {
      if (response.code == 200) {
        let list = [];
        list.push({ fileName: response.fileName, name: response.oldFileName });
        this.form[this.actionFile.prop] = JSON.stringify(list);
        this.$message.success("上传成功！");
        this.$refs.form.clearValidate(this.actionFile.prop);
        this.openUpload = false;
      }
    },
    removeFile(file, fileList) {
      this.fileList = [];
    },
    handleCurrentChange(val) {
      this.queryParams.pageNum = val;
      this.getPage();
    },
    // 提交导入文件
    submitFileForm() {
      this.$refs.upload.submit();
    },
  },
};
</script>    
<style lang="scss" scoped>
::v-deep .el-dialog .el-dialog__body {
  padding: 30px 20px !important;
  text-align: center;
}
</style>